<app-editor [(ngModel)]="data" (ngModelChange)="basicForm.patchValue($event)" [submitting]="submitting" (submit)="submit()">

  <nz-collapse [formGroup]="basicForm" (change)="change()">
    <nz-collapse-panel nzHeader="基本信息" nzActive>
      <nz-form-item>
        <nz-form-label [nzSpan]="5">名称</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <input nz-input formControlName="name" max="40" required/>
        </nz-form-control>
      </nz-form-item>


      <nz-form-item>
        <nz-form-label [nzSpan]="5">通道</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <app-choose-tunnel formControlName="tunnel_id"></app-choose-tunnel>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">端口</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <nz-input-number formControlName="port" [nzMin]="100" [nzMax]="65535" nzPlaceHolder="TCP监听端口，请注意避免端口冲突"></nz-input-number>
        </nz-form-control>
      </nz-form-item>

      <nz-form-item>
        <nz-form-label [nzSpan]="5">禁用</nz-form-label>
        <nz-form-control [nzSpan]="12" nzErrorTip="">
          <nz-switch formControlName="disabled"></nz-switch>
        </nz-form-control>
      </nz-form-item>

    </nz-collapse-panel>


  </nz-collapse>


</app-editor>
